<template>
    <view class="page-box">
        <header class="header">
            <text class="iconfont icon-jindu"></text>
            <view class="progress">
                <view class="progress-step column rowCenter verCenter" :class="{active: index <= curr}" v-for="(item,index) in progress" :key="index">
                    <text class="status-bar"></text>
                    <text class="tt">{{item}}</text>
                </view>
            </view>
        </header>
        <section class="section">
            <!-- 预审 -->
            <view class="pre-review-add-info" v-if="curr == 0">
                <!-- 待客户申请 -->
                <template v-if="self_business_progress_node == 1">
                    <view class="status-sign row rowCenter verCenter">
                        <view class="ico"></view>
                        <text class="tt">{{self_business_progress_node_val}}</text>
                    </view>
                    <view class="customer-order-information">
                        <text class="title row rowCenter verCenter">客户订单信息：</text>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">主贷人：</view>
                            <text class="t1">{{detail.apply_name}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">订单编号：</view>
                            <text class="t1">{{detail.order_sn}}</text>
                        </view>
                        <view class="text-box row verCenter">
                            <view class="label">申请金额：</view>
                            <text class="t2">{{detail.apply_amount}}元</text>
                        </view>
                    </view>
                    <view class="info-t1" style="margin-top: 40rpx;margin-bottom: 7rpx;">尊敬的客户，请长按识别二维码，</view>
                    <view class="info-t2" style="margin-bottom: 32rpx;">申请<text>{{detail.product_name}}</text>产品</view>
                    <view class="qr-code" v-if="detail.show_qrcode">
                        <image :src="detail.show_qrcode" mode="widthFix"></image>
                    </view>
                    <view class="info-t3" style="margin-top: 24rpx;margin-bottom: 10rpx;">二维码有效期至</view>
                    <view class="info-t4">{{getNextDayDate()}}</view>
                </template>
                <!-- 待客户准入 -->
                <template v-else-if="self_business_progress_node == 2">
                    <view class="status-sign row rowCenter verCenter">
                        <view class="ico"></view>
                        <text class="tt">{{self_business_progress_node_val}}</text>
                    </view>
                    <view class="customer-order-information">
                        <text class="title row rowCenter verCenter">客户订单信息：</text>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">主贷人：</view>
                            <text class="t1">{{detail.apply_name}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">订单编号：</view>
                            <text class="t1">{{detail.order_sn}}</text>
                        </view>
                        <view class="text-box row verCenter">
                            <view class="label">申请金额：</view>
                            <text class="t2">{{detail.apply_amount}}元</text>
                        </view>
                    </view>
                    <view class="info-t1" style="margin-top: 40rpx;margin-bottom: 7rpx;">尊敬的客户，请长按识别二维码，</view>
                    <view class="info-t2" style="margin-bottom: 32rpx;">申请<text>{{detail.product_name}}</text>产品</view>
                    <view class="qr-code" v-if="detail.show_qrcode">
                        <image :src="detail.show_qrcode" mode="widthFix"></image>
                    </view>
                    <view class="customer-order-information">
                        <text class="title row rowCenter verCenter" style="width: 170rpx;">车辆信息：</text>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">车辆品牌：</view>
                            <text class="t1">{{detail.vehicle_brand}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">车牌号码：</view>
                            <text class="t1">{{detail.car_no}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">表显里程：</view>
                            <text class="t1">{{detail.mileage}}公里</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">首次上牌日期：</view>
                            <text class="t1">{{detail.vehicle_first_registration_date}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 28rpx;">
                            <view class="label">VIN码：</view>
                            <text class="t1">{{detail.vehicle_vin}}</text>
                        </view>
                        <view class="title row rowCenter verCenter" style="width: 203rpx;">车辆评估价：</view>
                        <view class="car">
                            <view class="box column rowCenter verCenter">
                                <text class="t1">车况一般</text>
                                <text class="t2">{{detail.vehicle_condition_price.c}}万元</text>
                            </view>
                            <view class="box column rowCenter verCenter">
                                <text class="t1">车况良好</text>
                                <text class="t2">{{detail.vehicle_condition_price.b}}万元</text>
                            </view>
                            <view class="box column rowCenter verCenter">
                                <text class="t1">车况优秀</text>
                                <text class="t2">{{detail.vehicle_condition_price.a}}万元</text>
                            </view>
                        </view>
                    </view>
                </template>
                <!-- 客户准入未通过 -->
                <template v-else-if="self_business_progress_node == 3">
                    <view class="review-failed" style="margin-bottom: 60rpx ;">
                        <view class="row">
                            <view class="pic"></view>
                            <text class="fail-text">客户准入未通过</text>
                        </view>
                        <view class="fail-text-desc">{{detail.audit_remark}}</view>
                    </view>
                    <view class="customer-order-information" style="margin-bottom: 20rpx;">
                        <text class="title row rowCenter verCenter">客户订单信息：</text>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">主贷人：</view>
                            <text class="t1">{{detail.apply_name}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">订单编号：</view>
                            <text class="t1">{{detail.order_sn}}</text>
                        </view>
                        <view class="text-box row verCenter">
                            <view class="label">申请金额：</view>
                            <text class="t2">{{detail.apply_amount}}元</text>
                        </view>
                    </view>
                    <view class="customer-order-information">
                        <text class="title row rowCenter verCenter" style="width: 170rpx;">车辆信息：</text>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">车辆品牌：</view>
                            <text class="t1">{{detail.vehicle_brand}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">车牌号码：</view>
                            <text class="t1">{{detail.car_no}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">表显里程：</view>
                            <text class="t1">{{detail.mileage}}公里</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">首次上牌日期：</view>
                            <text class="t1">{{detail.vehicle_first_registration_date}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 28rpx;">
                            <view class="label">VIN码：</view>
                            <text class="t1">{{detail.vehicle_vin}}</text>
                        </view>
                        <view class="title row rowCenter verCenter" style="width: 203rpx;">车辆评估价：</view>
                        <view class="car">
                            <view class="box column rowCenter verCenter">
                                <text class="t1">车况一般</text>
                                <text class="t2">{{detail.vehicle_condition_price.c}}万元</text>
                            </view>
                            <view class="box column rowCenter verCenter">
                                <text class="t1">车况良好</text>
                                <text class="t2">{{detail.vehicle_condition_price.b}}万元</text>
                            </view>
                            <view class="box column rowCenter verCenter">
                                <text class="t1">车况优秀</text>
                                <text class="t2">{{detail.vehicle_condition_price.a}}万元</text>
                            </view>
                        </view>
                    </view>
                </template>
            </view>
            <!-- 审批 -->
            <view class="approve-add-info" v-if="curr == 1">
                <!-- 待提交进件资料 -->
                <template v-if="self_business_progress_node == 4">
                    <view class="status-sign row rowCenter verCenter">
                        <view class="ico"></view>
                        <text class="tt">{{self_business_progress_node_val}}</text>
                    </view>
                    <view class="customer-order-information">
                        <text class="title row rowCenter verCenter">客户订单信息：</text>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">主贷人：</view>
                            <text class="t1">{{detail.apply_name}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">订单编号：</view>
                            <text class="t1">{{detail.order_sn}}</text>
                        </view>
                        <view class="text-box row verCenter">
                            <view class="label">申请金额：</view>
                            <text class="t2">{{detail.apply_amount}}元</text>
                        </view>
                    </view>
                    <view class="info-t1" style="margin-top: 40rpx;margin-bottom: 7rpx;">尊敬的客户，请长按识别二维码，</view>
                    <view class="info-t2" style="margin-bottom: 32rpx;">申请<text>{{detail.product_name}}</text>产品</view>
                    <view class="qr-code" v-if="detail.show_qrcode">
                        <image :src="detail.show_qrcode" mode="widthFix"></image>
                    </view>
                    <view class="customer-order-information">
                        <text class="title row rowCenter verCenter" style="width: 170rpx;">车辆信息：</text>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">车辆品牌：</view>
                            <text class="t1">{{detail.vehicle_brand}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">车牌号码：</view>
                            <text class="t1">{{detail.car_no}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">表显里程：</view>
                            <text class="t1">{{detail.mileage}}公里</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">首次上牌日期：</view>
                            <text class="t1">{{detail.vehicle_first_registration_date}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 28rpx;">
                            <view class="label">VIN码：</view>
                            <text class="t1">{{detail.vehicle_vin}}</text>
                        </view>
                        <view class="title row rowCenter verCenter" style="width: 203rpx;">车辆评估价：</view>
                        <view class="car">
                            <view class="box column rowCenter verCenter">
                                <text class="t1">车况一般</text>
                                <text class="t2">{{detail.vehicle_condition_price.c}}万元</text>
                            </view>
                            <view class="box column rowCenter verCenter">
                                <text class="t1">车况良好</text>
                                <text class="t2">{{detail.vehicle_condition_price.b}}万元</text>
                            </view>
                            <view class="box column rowCenter verCenter">
                                <text class="t1">车况优秀</text>
                                <text class="t2">{{detail.vehicle_condition_price.a}}万元</text>
                            </view>
                        </view>
                    </view>
                </template>
                <!-- 待资方审批 -->
                <template v-else-if="self_business_progress_node == 5">
                    <view class="status-sign row rowCenter verCenter">
                        <view class="ico"></view>
                        <text class="tt">{{self_business_progress_node_val}}</text>
                        <a class="phone_check_description row rowCenter verCenter" v-if="detail.phone_check_description_url" @click="previewDescription(detail.phone_check_description_url)">
                            <text class="iconfont icon-a-tubiaochangyongsousuo20"></text>
                            电核说明
                        </a>
                    </view>
                    <view class="customer-order-information" style="margin-bottom: 20rpx;">
                        <text class="title row rowCenter verCenter">客户订单信息：</text>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">主贷人：</view>
                            <text class="t1">{{detail.apply_name}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">订单编号：</view>
                            <text class="t1">{{detail.order_sn}}</text>
                        </view>
                        <view class="text-box row verCenter">
                            <view class="label">申请金额：</view>
                            <text class="t2">{{detail.apply_amount}}元</text>
                        </view>
                    </view>
                    <view class="customer-order-information">
                        <text class="title row rowCenter verCenter" style="width: 170rpx;">车辆信息：</text>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">车辆品牌：</view>
                            <text class="t1">{{detail.vehicle_brand}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">车牌号码：</view>
                            <text class="t1">{{detail.car_no}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">表显里程：</view>
                            <text class="t1">{{detail.mileage}}公里</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">首次上牌日期：</view>
                            <text class="t1">{{detail.vehicle_first_registration_date}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 28rpx;">
                            <view class="label">VIN码：</view>
                            <text class="t1">{{detail.vehicle_vin}}</text>
                        </view>
                        <view class="title row rowCenter verCenter" style="width: 203rpx;">车辆评估价：</view>
                        <view class="car">
                            <view class="box column rowCenter verCenter">
                                <text class="t1">车况一般</text>
                                <text class="t2">{{detail.vehicle_condition_price.c}}万元</text>
                            </view>
                            <view class="box column rowCenter verCenter">
                                <text class="t1">车况良好</text>
                                <text class="t2">{{detail.vehicle_condition_price.b}}万元</text>
                            </view>
                            <view class="box column rowCenter verCenter">
                                <text class="t1">车况优秀</text>
                                <text class="t2">{{detail.vehicle_condition_price.a}}万元</text>
                            </view>
                        </view>
                    </view>
                </template>
                <!-- 审批未通过 -->
                <template v-else-if="self_business_progress_node == 6">
                    <view class="review-failed" style="margin-bottom: 60rpx ;">
                        <view class="row">
                            <view class="pic"></view>
                            <text class="fail-text">{{self_business_progress_node_val}}</text>
                        </view>
                        <view class="fail-text-desc">{{detail.node_status.business_status_remark}}</view>
                    </view>
                    <view class="customer-order-information" style="margin-bottom: 20rpx;">
                        <text class="title row rowCenter verCenter">客户订单信息：</text>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">主贷人：</view>
                            <text class="t1">{{detail.apply_name}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">订单编号：</view>
                            <text class="t1">{{detail.order_sn}}</text>
                        </view>
                        <view class="text-box row verCenter">
                            <view class="label">申请金额：</view>
                            <text class="t2">{{detail.apply_amount}}元</text>
                        </view>
                    </view>
                    <view class="customer-order-information">
                        <text class="title row rowCenter verCenter" style="width: 170rpx;">车辆信息：</text>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">车辆品牌：</view>
                            <text class="t1">{{detail.vehicle_brand}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">车牌号码：</view>
                            <text class="t1">{{detail.car_no}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">表显里程：</view>
                            <text class="t1">{{detail.mileage}}公里</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">首次上牌日期：</view>
                            <text class="t1">{{detail.vehicle_first_registration_date}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 28rpx;">
                            <view class="label">VIN码：</view>
                            <text class="t1">{{detail.vehicle_vin}}</text>
                        </view>
                        <view class="title row rowCenter verCenter" style="width: 203rpx;">车辆评估价：</view>
                        <view class="car">
                            <view class="box column rowCenter verCenter">
                                <text class="t1">车况一般</text>
                                <text class="t2">{{detail.vehicle_condition_price.c}}万元</text>
                            </view>
                            <view class="box column rowCenter verCenter">
                                <text class="t1">车况良好</text>
                                <text class="t2">{{detail.vehicle_condition_price.b}}万元</text>
                            </view>
                            <view class="box column rowCenter verCenter">
                                <text class="t1">车况优秀</text>
                                <text class="t2">{{detail.vehicle_condition_price.a}}万元</text>
                            </view>
                        </view>
                    </view>
                </template>
                <!-- 资方退回需补充资料 -->
                <template v-else-if="self_business_progress_node == 7">
                    <view class="review-failed" style="margin-bottom: 60rpx ;">
                        <view class="row">
                            <view class="pic-return"></view>
                            <text class="fail-text">{{self_business_progress_node_val}}</text>
                        </view>
                        <view class="fail-text-desc">{{detail.node_status.business_status_remark}}</view>
                    </view>
                    <view class="customer-order-information" style="margin-bottom: 20rpx;">
                        <text class="title row rowCenter verCenter">客户订单信息：</text>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">主贷人：</view>
                            <text class="t1">{{detail.apply_name}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">订单编号：</view>
                            <text class="t1">{{detail.order_sn}}</text>
                        </view>
                        <view class="text-box row verCenter">
                            <view class="label">申请金额：</view>
                            <text class="t2">{{detail.apply_amount}}元</text>
                        </view>
                    </view>
                    <view class="info-t1" style="margin-top: 40rpx;margin-bottom: 7rpx;">待客户提交补充材料，重新评定</view>
                    <view class="qr-code" v-if="detail.show_qrcode">
                        <image :src="detail.show_qrcode" mode="widthFix"></image>
                    </view>
                    <view class="customer-order-information">
                        <text class="title row rowCenter verCenter" style="width: 170rpx;">车辆信息：</text>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">车辆品牌：</view>
                            <text class="t1">{{detail.vehicle_brand}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">车牌号码：</view>
                            <text class="t1">{{detail.car_no}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">表显里程：</view>
                            <text class="t1">{{detail.mileage}}公里</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">首次上牌日期：</view>
                            <text class="t1">{{detail.vehicle_first_registration_date}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 28rpx;">
                            <view class="label">VIN码：</view>
                            <text class="t1">{{detail.vehicle_vin}}</text>
                        </view>
                        <view class="title row rowCenter verCenter" style="width: 203rpx;">车辆评估价：</view>
                        <view class="car">
                            <view class="box column rowCenter verCenter">
                                <text class="t1">车况一般</text>
                                <text class="t2">{{detail.vehicle_condition_price.c}}万元</text>
                            </view>
                            <view class="box column rowCenter verCenter">
                                <text class="t1">车况良好</text>
                                <text class="t2">{{detail.vehicle_condition_price.b}}万元</text>
                            </view>
                            <view class="box column rowCenter verCenter">
                                <text class="t1">车况优秀</text>
                                <text class="t2">{{detail.vehicle_condition_price.a}}万元</text>
                            </view>
                        </view>
                    </view>
                </template>
                <!-- 审批通过 -->
                <template v-else-if="self_business_progress_node == 8">
                    <view class="status-sign row  verCenter" style="margin-bottom: 12rpx;">
                        <view class="ico-success"></view>
                        <text class="tt">{{self_business_progress_node_val}}</text>
                    </view>
                    <view class="audit_remark" style="margin-bottom: 60rpx;" v-if="detail.node_status">
                        {{detail.node_status.business_status_remark}}
                    </view>
                    <view class="customer-order-information" style="margin-bottom: 20rpx;">
                        <text class="title row rowCenter verCenter">客户订单信息：</text>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">主贷人：</view>
                            <text class="t1">{{detail.apply_name}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">订单编号：</view>
                            <text class="t1">{{detail.order_sn}}</text>
                        </view>
                        <view class="text-box row verCenter">
                            <view class="label">申请金额：</view>
                            <text class="t2">{{detail.apply_amount}}元</text>
                        </view>
                        <view class="subscription-information" style="margin-top: 14rpx;">
                            <view class="tit">批复金额</view>
                            <view class="row rowCenter verCenter price">{{detail.credit_amount}}元</view>
                            <view class="subscription-information-info row bothSide verCenter">
                                <view class="box column rowCenter verCenter">
                                    <text class="t1">{{detail.annual_profit_rate}}%</text>
                                    <text class="t2">年化利率</text>
                                </view>
                                <view class="box column rowCenter verCenter">
                                    <text class="t1">{{detail.loan_cycle}}期</text>
                                    <text class="t2">贷款期数</text>
                                </view>
                            </view>
                        </view>
                    </view>
                    <view class="customer-order-information">
                        <text class="title row rowCenter verCenter" style="width: 170rpx;">签约说明：</text>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">备注：</view>
                            <text class="t1">{{detail.lending_condition}}</text>
                        </view>
                    </view>
                    <view class="audit-btn row rowCenter verCenter" @click="open()" style="margin-top: 32rpx;">待发起签约</view>
                </template>
                <!-- 审批通过（补录资料） -->
                <template v-else-if="self_business_progress_node == 9">
                    <view class="status-sign row rowCenter verCenter" style="margin-bottom: 12rpx;">
                        <view class="ico-success"></view>
                        <text class="tt">{{self_business_progress_node_val}}</text>
                    </view>
                    <view class="audit_remark" style="margin-bottom: 60rpx;" v-if="detail.node_status">
                        {{detail.node_status.business_status_remark}}
                    </view>
                    <view class="customer-order-information" style="margin-bottom: 20rpx;">
                        <text class="title row rowCenter verCenter">客户订单信息：</text>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">主贷人：</view>
                            <text class="t1">{{detail.apply_name}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">订单编号：</view>
                            <text class="t1">{{detail.order_sn}}</text>
                        </view>
                        <view class="text-box row verCenter">
                            <view class="label">申请金额：</view>
                            <text class="t2">{{detail.apply_amount}}元</text>
                        </view>
                        <view class="subscription-information" style="margin-top: 14rpx;">
                            <view class="tit">批复金额</view>
                            <view class="row rowCenter verCenter price">{{detail.credit_amount}}元</view>
                            <view class="subscription-information-info row bothSide verCenter">
                                <view class="box column rowCenter verCenter">
                                    <text class="t1">{{detail.annual_profit_rate}}%</text>
                                    <text class="t2">年化利率</text>
                                </view>
                                <view class="box column rowCenter verCenter">
                                    <text class="t1">{{detail.loan_cycle}}期</text>
                                    <text class="t2">贷款期数</text>
                                </view>
                            </view>
                        </view>
                    </view>
                    <view class="info-t1" style="margin-top: 40rpx;margin-bottom: 7rpx;">请长按识别二维码，资料补录</view>
                    <view class="qr-code" v-if="detail.show_qrcode">
                        <image :src="detail.show_qrcode" mode="widthFix"></image>
                    </view>
                </template>
            </view>
            <!-- 签约 -->
            <view class="signing-add-info" v-if="curr == 2">
                <!-- 待发起签约 -->
                <template v-if="self_business_progress_node == 10">
                    <view class="status-sign row  verCenter" style="margin-bottom: 12rpx;">
                        <view class="ico"></view>
                        <text class="tt">{{self_business_progress_node_val}}</text>
                        <a class="phone_check_description row rowCenter verCenter" v-if="detail.signing_description_url" @click="previewDescription(detail.signing_description_url)">
                            <text class="iconfont icon-a-tubiaochangyongsousuo20"></text>
                            签约说明
                        </a>
                    </view>
                    <view class="audit_remark" style="margin-bottom: 60rpx;" v-if="detail.node_status">
                        {{detail.node_status.business_status_remark}}
                    </view>
                    <view class="customer-order-information">
                        <text class="title row rowCenter verCenter">客户订单信息：</text>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">主贷人：</view>
                            <text class="t1">{{detail.apply_name}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">订单编号：</view>
                            <text class="t1">{{detail.order_sn}}</text>
                        </view>
                        <view class="text-box row verCenter">
                            <view class="label">申请金额：</view>
                            <text class="t2">{{detail.apply_amount}}元</text>
                        </view>
                        <view class="subscription-information" style="margin-top: 14rpx;">
                            <view class="tit">签约金额</view>
                            <view class="row rowCenter verCenter price">{{detail.credit_amount}}元</view>
                            <view class="subscription-information-info row bothSide verCenter">
                                <view class="box column rowCenter verCenter">
                                    <text class="t1">{{detail.annual_profit_rate}}%</text>
                                    <text class="t2">年化利率</text>
                                </view>
                                <view class="box column rowCenter verCenter">
                                    <text class="t1">{{detail.loan_cycle}}期</text>
                                    <text class="t2">贷款期数</text>
                                </view>
                            </view>
                        </view>
                    </view>
                    <view class="info-t1 column" style="margin-top: 40rpx;margin-bottom: 7rpx;text-align: left;">
                        <view class="row verCenter">
                            <checkbox-group @change="checkboxChange($event,1)">
                                <checkbox :checked="is_checked_1" value="1" style="transform:scale(0.6)"></checkbox>
                            </checkbox-group>
                            <text>客户已完成资方短信发送电子合同签署</text>
                        </view>
                        <view class="row verCenter">
                            <checkbox-group @change="checkboxChange($event,2)">
                                <checkbox :checked="is_checked_2" value="1" style="transform:scale(0.6)"></checkbox>
                            </checkbox-group>
                            <text>客户已完成资方短信发送电子合同签署</text>
                        </view>
                        <template v-if="detail.is_sign_elec_contract">
                            <view class="confirm-btn row rowCenter verCenter" style="margin-top: 35rpx;" :class="{disabled:detail.is_sign_elec_contract == 1}">已确认</view>
                        </template>
                        <template v-else>
                            <view class="confirm-btn row rowCenter verCenter" style="margin-top: 35rpx;" @click="confirmElecContract()" :class="{disabled:detail.is_sign_elec_contract == 1}">请确认</view>
                        </template>
                    </view>
                </template>
                <!-- 待客户签约 -->
                <template v-if="self_business_progress_node == 11">
                    <view class="status-sign row  verCenter" style="margin-bottom: 12rpx;">
                        <view class="ico"></view>
                        <text class="tt">{{self_business_progress_node_val}}</text>
                    </view>
                    <view class="audit_remark" style="margin-bottom: 60rpx;" v-if="detail.node_status">
                        {{detail.node_status.business_status_remark}}
                    </view>
                    <view class="customer-order-information">
                        <text class="title row rowCenter verCenter">客户订单信息：</text>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">主贷人：</view>
                            <text class="t1">{{detail.apply_name}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">订单编号：</view>
                            <text class="t1">{{detail.order_sn}}</text>
                        </view>
                        <view class="text-box row verCenter">
                            <view class="label">申请金额：</view>
                            <text class="t2">{{detail.apply_amount}}元</text>
                        </view>
                        <view class="subscription-information" style="margin-top: 14rpx;">
                            <view class="tit">签约金额</view>
                            <view class="row rowCenter verCenter price">{{detail.credit_amount}}元</view>
                            <view class="subscription-information-info row bothSide verCenter">
                                <view class="box column rowCenter verCenter">
                                    <text class="t1">{{detail.annual_profit_rate}}%</text>
                                    <text class="t2">年化利率</text>
                                </view>
                                <view class="box column rowCenter verCenter">
                                    <text class="t1">{{detail.loan_cycle}}期</text>
                                    <text class="t2">贷款期数</text>
                                </view>
                            </view>
                        </view>
                    </view>
                    <view class="info-t1" style="margin-top: 40rpx;margin-bottom: 7rpx;">请长按识别二维码，合同签署</view>
                    <view class="qr-code" v-if="detail.show_qrcode">
                        <image :src="detail.show_qrcode" mode="widthFix"></image>
                    </view>
                </template>
            </view>
            <!-- 车务 -->
            <view class="vehicle-handling-add-info" v-if="curr == 3">
                <!-- 车务办理 -->
                <template v-if="self_business_progress_node == 12">
                    <view class="status-sign row  verCenter" style="margin-bottom: 12rpx;">
                        <view class="ico"></view>
                        <text class="tt">{{self_business_progress_node_val}}</text>
                    </view>
                    <view class="audit_remark" style="margin-bottom: 60rpx;" v-if="detail.node_status">
                        {{detail.node_status.business_status_remark}}
                    </view>
                    <view class="customer-order-information">
                        <text class="title row rowCenter verCenter">客户订单信息：</text>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">主贷人：</view>
                            <text class="t1">{{detail.apply_name}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">订单编号：</view>
                            <text class="t1">{{detail.order_sn}}</text>
                        </view>
                        <view class="text-box row verCenter">
                            <view class="label">申请金额：</view>
                            <text class="t2">{{detail.apply_amount}}元</text>
                        </view>
                        <view class="subscription-information" style="margin-top: 14rpx;">
                            <view class="tit">签约金额</view>
                            <view class="row rowCenter verCenter price">{{detail.credit_amount}}元</view>
                            <view class="subscription-information-info row bothSide verCenter">
                                <view class="box column rowCenter verCenter">
                                    <text class="t1">{{detail.annual_profit_rate}}%</text>
                                    <text class="t2">年化利率</text>
                                </view>
                                <view class="box column rowCenter verCenter">
                                    <text class="t1">{{detail.loan_cycle}}期</text>
                                    <text class="t2">贷款期数</text>
                                </view>
                            </view>
                        </view>
                    </view>
                    <view class="info-t1" style="margin-top: 40rpx;margin-bottom: 7rpx;">扫一扫，办理抵押和GPS</view>
                    <view class="qr-code" v-if="detail.show_qrcode">
                        <image :src="detail.show_qrcode" mode="widthFix"></image>
                    </view>
                </template>
            </view>
            <!-- 请款 -->
            <view class="request-funds-add-info" v-if="curr == 4">
                <!-- 待提交请款资料 -->
                <template v-if="self_business_progress_node == 13">
                    <view class="status-sign row rowCenter verCenter" style="margin-bottom: 12rpx;">
                        <view class="pending-submission-of-payment-request-documents"></view>
                        <text class="tt">{{self_business_progress_node_val}}</text>
                        <a class="phone_check_description row rowCenter verCenter" v-if="detail.request_funds_url" @click="previewDescription(detail.request_funds_url)">
                            <text class="iconfont icon-a-tubiaochangyongsousuo20"></text>
                            请款资料
                        </a>
                    </view>
                    <view class="audit_remark" style="margin-bottom: 60rpx;" v-if="detail.node_status">
                        {{detail.node_status.business_status_remark}}
                    </view>
                    <view class="customer-order-information">
                        <text class="title row rowCenter verCenter">客户订单信息：</text>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">主贷人：</view>
                            <text class="t1">{{detail.apply_name}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">订单编号：</view>
                            <text class="t1">{{detail.order_sn}}</text>
                        </view>
                        <view class="text-box row verCenter">
                            <view class="label">申请金额：</view>
                            <text class="t2">{{detail.apply_amount}}元</text>
                        </view>
                        <view class="subscription-information" style="margin-top: 14rpx;">
                            <view class="tit">签约金额</view>
                            <view class="row rowCenter verCenter price">{{detail.credit_amount}}元</view>
                            <view class="subscription-information-info row bothSide verCenter">
                                <view class="box column rowCenter verCenter">
                                    <text class="t1">{{detail.annual_profit_rate}}%</text>
                                    <text class="t2">年化利率</text>
                                </view>
                                <view class="box column rowCenter verCenter">
                                    <text class="t1">{{detail.loan_cycle}}期</text>
                                    <text class="t2">贷款期数</text>
                                </view>
                            </view>
                        </view>
                    </view>
                    <view class="info-t1" style="margin-top: 40rpx;margin-bottom: 7rpx;">扫一扫，提交请款所需的资料</view>
                    <view class="qr-code" v-if="detail.show_qrcode">
                        <image :src="detail.show_qrcode" mode="widthFix"></image>
                    </view>
                </template>
                <!-- 放款完成 -->
                <template v-if="self_business_progress_node == 14">
                    <view class="status-sign row rowCenter verCenter" style="margin-bottom: 12rpx;">
                        <view class="ico-success"></view>
                        <text class="tt">{{self_business_progress_node_val}}</text>
                        <a class="phone_check_description row rowCenter verCenter" v-if="detail.documentation_url" @click="previewDescription(detail.documentation_url)" style="top: -27rpx;">
                            <text class="iconfont icon-a-tubiaochangyongsousuo20"></text>
                            归档资料
                        </a>
                    </view>
                    <view class="audit_remark" style="margin-bottom: 60rpx;" v-if="detail.node_status">
                        {{detail.node_status.business_status_remark}}
                    </view>
                    <view class="customer-order-information">
                        <text class="title row rowCenter verCenter">客户订单信息：</text>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">主贷人：</view>
                            <text class="t1">{{detail.apply_name}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">订单编号：</view>
                            <text class="t1">{{detail.order_sn}}</text>
                        </view>
                        <view class="text-box row verCenter">
                            <view class="label">申请金额：</view>
                            <text class="t2">{{detail.apply_amount}}元</text>
                        </view>
                        <view class="subscription-information" style="margin-top: 14rpx;">
                            <view class="tit">放款金额</view>
                            <view class="row rowCenter verCenter price">{{detail.apply_amount}}元</view>
                            <view class="subscription-information-info row bothSide verCenter">
                                <view class="box column rowCenter verCenter">
                                    <text class="t1">{{detail.annual_profit_rate}}%</text>
                                    <text class="t2">年化利率</text>
                                </view>
                                <view class="box column rowCenter verCenter">
                                    <text class="t1">{{detail.loan_cycle}}期</text>
                                    <text class="t2">贷款期数</text>
                                </view>
                            </view>
                        </view>
                    </view>
                    <view class="info-t1" style="margin-top: 40rpx;margin-bottom: 7rpx;">扫一扫，回传材料归档</view>
                    <view class="qr-code" v-if="detail.show_qrcode">
                        <image :src="detail.show_qrcode" mode="widthFix"></image>
                    </view>
                </template>
                <!-- 订单归档完成 -->
                <template v-if="self_business_progress_node == 15 || self_business_progress_node == 16">
                    <view class="status-sign row rowCenter verCenter" style="margin-bottom: 12rpx;">
                        <view class="ico-success"></view>
                        <text class="tt">{{self_business_progress_node_val}}</text>
                    </view>
                    <view class="audit_remark" style="margin-bottom: 60rpx;" v-if="detail.node_status">
                        {{detail.node_status.business_status_remark}}
                    </view>
                    <view class="customer-order-information">
                        <text class="title row rowCenter verCenter">客户订单信息：</text>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">主贷人：</view>
                            <text class="t1">{{detail.apply_name}}</text>
                        </view>
                        <view class="text-box row verCenter" style="margin-bottom: 12rpx;">
                            <view class="label">订单编号：</view>
                            <text class="t1">{{detail.order_sn}}</text>
                        </view>
                        <view class="text-box row verCenter">
                            <view class="label">申请金额：</view>
                            <text class="t2">{{detail.apply_amount}}元</text>
                        </view>
                        <view class="subscription-information" style="margin-top: 14rpx;">
                            <view class="tit">放款金额</view>
                            <view class="row rowCenter verCenter price">{{detail.apply_amount}}元</view>
                            <view class="subscription-information-info row bothSide verCenter">
                                <view class="box column rowCenter verCenter">
                                    <text class="t1">{{detail.annual_profit_rate}}%</text>
                                    <text class="t2">年化利率</text>
                                </view>
                                <view class="box column rowCenter verCenter">
                                    <text class="t1">{{detail.loan_cycle}}期</text>
                                    <text class="t2">贷款期数</text>
                                </view>
                            </view>
                        </view>
                    </view>
                    <view class="business-processing-completed column rowCenter verCenter">
                        <image src='http://www.szxlyc.com/uploads/product/20240916/GxMjwpfYY3Z5DfjYUOUd3kWkPQctGYSf5SGVQjhM.png' mode="aspectFill"></image>
                        <text class="business-processing-completed-tt">恭喜您</text>
                        <text class="business-processing-completed-tt">业务办理已完成!</text>
                    </view>
                </template>
            </view>
            <navigator class="business-processing-wrap" :url="'/pages/order/selfDetailProgress?order_id='+order_id">
                <text class="iconfont icon-jindu business-processing-completed-tt"></text>
            </navigator>
        </section>
        <!-- 发起签约复议弹窗 -->
        <uni-popup ref="popup" background-color="#fff" borderRadius="20rpx 20rpx 20rpx 20rpx">
            <view class="popup-content column rowCenter verCenter">
                <view class="content column rowCenter verCenter">
                    <view class="ico">
                        <image src="http://www.szxlyc.com/uploads/product/20240928/Ao8aISSaZw0CNiIoYx50b9gShm60b49lsr4rG8Rs.png" mode="aspectFill"></image>
                    </view>
                    <view class="text">
                        若客户对当前批复额度不满意，可补充材料复议，<text class="t1">仅能发起一次复议</text>，发起签约即代表放弃复议机会。
                    </view>
                    <view class="btn1 row rowCenter verCenter" @click="approveSigning()">发起签约</view>
                    <view class="btn2 row rowCenter verCenter" @click="approveReview()">发起复议</view>
                </view>
                <view class="iconfont icon-a-tubiaochangyongsousuo9" @click="close()" style="display: none;"></view>
            </view>
        </uni-popup>
    </view>
</template>

<script>
    import { API } from '@/util/api.js';
    export default {
        data() {
            return {
                order_id: '',
                is_checked_1: false,
                is_checked_2: false,
                self_business_progress: '', //自主业务进度
                self_business_progress_val: '',
                self_business_progress_node: '', //自主业务进度节点
                self_business_progress_node_val: '',
                curr: 0,
                progress: ['预审', '审批', '签约', '车务', '请款'],
                detail: {}
            };
        },
        onLoad(options) {
            this.order_id = options.order_id;
        },
        onShow() {
            this.getOrderDetail();
        },
        methods: {
            /**
             * checkbox监听
             * @param {Object} e
             */
            checkboxChange(e, type) {
                var values = e.detail.value;
                if (type == 1) {
                    if (values[0] == 1) {
                        this.is_checked_1 = true;
                    } else {
                        this.is_checked_1 = false;
                    }
                } else if (type == 2) {
                    if (values[0] == 1) {
                        this.is_checked_2 = true;
                    } else {
                        this.is_checked_2 = false;
                    }
                }
            },
            /**
             * 获取当前日期加一天
             * @returns {string} 格式化的日期字符串
             */
            getNextDayDate() {
                const now = new Date();
                const nextDay = new Date(now.getTime() + 24 * 60 * 60 * 1000);
                const year = nextDay.getFullYear();
                const month = String(nextDay.getMonth() + 1).padStart(2, '0');
                const day = String(nextDay.getDate()).padStart(2, '0');
                const hours = String(nextDay.getHours()).padStart(2, '0');
                const minutes = String(nextDay.getMinutes()).padStart(2, '0');
                const seconds = String(nextDay.getSeconds()).padStart(2, '0');

                return `${year}/${month}/${day} ${hours}:${minutes}:${seconds}`;
            },
            /**
             * 获取业务进度
             */
            getOrderDetail() {
                this.request(API.orderDetail, 'GET', { order_id: this.order_id }, true).then(res => {
                    if (res.code === 0) {
                        this.detail = res.data;
                        this.self_business_progress = res.data.self_business_progress;

                        this.self_business_progress_node = res.data.self_business_progress_node;
                        this.self_business_progress_val = res.data.self_business_progress_val;
                        this.self_business_progress_node_val = res.data.self_business_progress_node_val;

                        this.is_checked_1 = res.data.is_sign_elec_contract == 1 ? true : false;
                        this.is_checked_2 = res.data.is_sign_elec_contract == 1 ? true : false;

                        const progressVal = res.data.self_business_progress_val;
                        var progressIndex = this.progress.indexOf(progressVal);
                        if (progressVal == '结算') {
                            progressIndex = 4;
                        }

                        if (progressIndex !== -1) {
                            this.curr = progressIndex;
                        }

                        uni.setNavigationBarTitle({
                            title: res.data.product_name + ' - 进件详情'
                        });

                    } else {
                        uni.showToast({
                            title: res.msg,
                            icon: 'none'
                        });
                    }
                });
            },
            /**
             * 打开弹窗
             */
            open() {
                this.$refs.popup.open();
            },
            /**
             * 关闭弹窗
             */
            close() {
                this.$refs.popup.close();
            },
            /**
             * 预览电核说明
             * @param {Object} url
             */
            previewDescription(url) {
                if (url) {
                    // 获取文件扩展名
                    const fileExtension = url.split('.').pop().toLowerCase();
                    // 图片格式
                    const imageExtensions = ['jpg', 'jpeg', 'png', 'gif', 'bmp'];
                    // PDF格式
                    const pdfExtensions = ['pdf'];
                    // 压缩包格式
                    const archiveExtensions = ['zip', 'rar'];

                    if (imageExtensions.includes(fileExtension)) {
                        // 预览图片
                        uni.previewImage({
                            current: 0,
                            urls: [url]
                        });
                    } else if (pdfExtensions.includes(fileExtension) || archiveExtensions.includes(fileExtension)) {
                        // 下载PDF或压缩包
                        uni.downloadFile({
                            url: url,
                            success: (res) => {
                                if (res.statusCode === 200) {
                                    // 打开文件
                                    uni.openDocument({
                                        filePath: res.tempFilePath,
                                        success: () => {
                                            console.log('文件打开成功');
                                        },
                                        fail: () => {
                                            uni.showToast({
                                                title: '文件打开失败',
                                                icon: 'none'
                                            });
                                        }
                                    });
                                }
                            },
                            fail: () => {
                                uni.showToast({
                                    title: '文件下载失败',
                                    icon: 'none'
                                });
                            }
                        });
                    } else {
                        uni.showToast({
                            title: '不支持的文件格式',
                            icon: 'none'
                        });
                    }
                } else {

                }

            },
            /**
             * 签约-待发起签约-确认电子合同
             */
            confirmElecContract() {
                if (!this.is_checked_1) {
                    uni.showToast({
                        title: '请确认客户已完成资方短信发送电子合同签署',
                        icon: 'none'
                    });
                    return false;
                }
                if (!this.is_checked_2) {
                    uni.showToast({
                        title: '请确认客户已完成平台电子合同签署',
                        icon: 'none'
                    });
                    return false;
                }

                this.request(API.confirmElecContract, 'POST', { order_id: this.order_id, is_sign_elec_contract: 1 }, true).then(res => {
                    if (res.code === 0) {
                        uni.showToast({
                            title: '操作成功',
                            icon: 'success'
                        });
                        setTimeout(() => {
                            this.getOrderDetail();
                        }, 2000)
                    } else {
                        uni.showToast({
                            title: res.msg,
                            icon: 'none'
                        });
                    }
                });
            },
            /**
             * 发起复议
             */
            approveReview() {
                this.request(API.approveReview, 'POST', { order_id: this.order_id }, true).then(res => {
                    if (res.code === 0) {
                        this.close();
                        uni.showToast({
                            title: '复议成功',
                            icon: 'success'
                        });
                        setTimeout(() => {
                            this.getOrderDetail();
                        }, 2000)

                    } else {
                        uni.showToast({
                            title: res.msg,
                            icon: 'none'
                        });
                    }
                });
            },
            /**
             * 发起签约
             */
            approveSigning() {
                this.request(API.approveSigning, 'POST', { order_id: this.order_id }, true).then(res => {
                    if (res.code === 0) {
                        this.close();
                        uni.showToast({
                            title: '操作成功',
                            icon: 'success'
                        });
                        setTimeout(() => {
                            this.getOrderDetail();
                        }, 2000)

                    } else {
                        uni.showToast({
                            title: res.msg,
                            icon: 'none'
                        });
                    }
                });
            },
            toUrl() {
                uni.navigateTo({
                    url: '/pages/order/selfDetailProgress?order_id=' + this.order_id
                })
            }
        }
    };
</script>

<style scoped lang="scss">
    @import '@/assets/css/order/selfDetail.scss';
</style>